<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <div style="height: 5000px;"></div>
  <script>
    // 防抖
    function debounce(func, wait){
      let timeout = null;
      return function(){
        if(timeout != null) clearTimeout(timeout);
        timeout = setTimeout(func, wait);
      }
    }

    window.addEventListener('scroll', debounce(function(){
      console.log(111)
    }, 1000));

    // 节流（时间戳）
    function throttle(fnuc, delay){
      let prev = Date.now();
      return function(){
        let context = this;
        let args = arguments;
        let now = Date.now();
        if(now - prev >= delay){
          fnuc.apply(context, args);
          prev = Date.now();
        }
      }
    }
    // window.addEventListener('scroll', throttle(function(){
    //   console.log(Math.random());
    // }, 1000))
  
    // 节流（定时器）
    function throttle1(func, delay) {
      var timer = null;
      return function() {
        var context = this;
        var args = arguments;
        if (!timer) {
          timer = setTimeout(function() {
            func.apply(context, args);
            timer = null;
          }, delay);
        }
      }
    }
  </script>
</body>
</html>